import 'table_page_state.dart';
import 'package:kmxy_base/base/base_package.dart';

class TablePageView extends TablePageState {
  @override
  Widget setPageContent(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: const Text(
          '表格案例',
          style: TextStyle(
            color: Colors.white,
            fontWeight: FontWeight.w700,
          ),
        ),
      ),
      body: SafeArea(
          child: TableView(
        onTableViewCreated: onTableViewCreated,
        titleList: [
          makeTableTitle('测站名称', 90.w),
          makeTableTitle('所属河湖', 90.w),
          makeTableTitle('来报时间', 90.w),
          makeTableTitle('总磷(mg/L)', 55.w),
          makeTableTitle('总氮(mg/L)', 55.w),
          makeTableTitle('氨氮(mg/L)', 55.w),
          makeTableTitle('高锰酸盐(mg/L)', 70.w),
          makeTableTitle('溶解氧(mg/L)', 55.w),
          makeTableTitle('PH', 40.w),
          makeTableTitle('电导率(μS/cm)', 60.w),
          makeTableTitle('浊度(NTU)', 45.w),
          makeTableTitle('水温(℃)', 40.w),
          makeTableTitle('达标情况', 65.w),
          makeTableTitle('超标项目/超标倍数', 65.w),
        ],
        contentList: (context, index, itemData) => [
          makeTableContent('板桥河水库', 90.w),
          makeTableContent('板桥河水库', 90.w),
          makeTableContent('2021-12-03 08:00:00', 90.w),
          makeTableContent('0.12', 55.w),
          makeTableContent('0.21', 55.w),
          makeTableContent('1.21', 55.w),
          makeTableContent('1.21', 70.w),
          makeTableContent('1.21', 55.w),
          makeTableContent('1.21', 40.w),
          makeTableContent('1.21', 60.w),
          makeTableContent('1.21', 45.w),
          makeTableContent('60', 40.w),
          SizedBox(
            width: 65.w,
            child: Container(
              margin: EdgeInsets.only(left: 10.w, right: 10.w),
              decoration: BoxDecoration(
                color:
                    Color(itemData['upExc'] == '0' ? 0xfff0f9eb : 0xfffef0f0),
                // 圆角设置
                borderRadius: BorderRadius.circular(3.w),
                border: Border.all(
                    color: Color(
                        itemData['upExc'] == '0' ? 0xffe1f3d8 : 0xfffde2e2),
                    width: 1),
              ),
              child: Text(
                '${itemData['upExc'] == '0' ? '达标' : '不达标'}',
                textAlign: TextAlign.center,
                style: TextStyle(
                  color:
                      Color(itemData['upExc'] == '0' ? 0xff67c23a : 0xfff56c6c),
                  fontSize: 12.sp,
                ),
              ),
            ),
          ),
          makeTableContent('氨氮/0.79；总磷/0.35；', 65.w),
        ],
        dataList: dataList,
        tableViewHeight: heightScreen - kToolbarHeight - 30.w,
        divider: Divider(height: 1.w),
        onRefresh: onRefresh,
        onLoading: onLoading,
      )),
    );
  }

  Widget makeTableTitle(String text, double width) {
    return Container(
      height: 50.w,
      width: width,
      alignment: Alignment.center,
      color: const Color(0xffF2F2F2),
      child: Text(
        text,
        textAlign: TextAlign.center,
        style: TextStyle(
          fontSize: 16.sp,
        ),
      ),
    );
  }

  Widget makeTableContent(String text, double width) {
    return Container(
      height: 50.w,
      width: width,
      alignment: Alignment.center,
      child: Text(
        text,
        textAlign: TextAlign.center,
        style: TextStyle(
          fontSize: 16.sp,
        ),
      ),
    );
  }
}
